{% extends "layout.html" %}
{% block headcenter %}
  <h4><a href="/prj/{{ g.prjprojid }}">{{ g.prjtitle }}</a></h4>
{% endblock %}

{% block body %}


<div class="panel panel-default" style="margin: 0px 5px">
  <div class="panel-heading">
    <h3 class="panel-title">图片及TSV文件导入（第一步）</h3>
  </div>
  <div class="panel-body">


<div class="help-block">
	<div class="row">
		<div class="col-sm-12">

<p><a href="#create-project" data-toggle="collapse" class="help">如何创建一个项目</a></p>
<div id="create-project" class="collapse">
  <p>若想创建第一个项目，你必须先联系应用管理员: {{ g.appmanagermailto|safe }}.</p>

  <p>然后你才可以创建新的项目.</p>
</div>

 {% include "task/import_create_shared_doc.html" %}

			<p><a href="#zooprocess-help" data-toggle="collapse" class="help">如何从ZooProcess导入数据</a></p>
			<div id="zooprocess-help" class="collapse">
				<p>使用的版本＞7.21.</p>
				<h5>导入先前经过验证的样本<small>(“sorted_vignettes”文件夹中排序的小图及dat1.tsv中的识别结果)</small></h5>
				<ul>
					<li>核对所有的元数据信息准确无误</li>
					<li>选择项目</li>
					<li>转换到高级模式</li>
					<li>运行ZooSCAN用户菜单“Other tools” 中的“Create tables for Ecotaxa”工具，然后运行"ALL sorted vignettes…”选项，来为你的项目生成Ecotaxa文件夹。这个Ecotaxa文件夹将包含按样本排序的TSV表格</li>
					<li>将这个"ecotaxa”文件夹上传到服务器中</li>
				</ul>

			<h5>导入未经验证的样本 <small>(进行中的项目)</small></h5>
				<ul>
					<li>核对所有的元数据信息准确无误</li>
					<li>Zooscan : 在图像处理过程中，TSV表格会和每个样品文件夹中的PID文件一起被自动创建</li>
					<li>所有设备：运行ZooSCAN用户菜单“Other tools” 中的“Create tables for Ecotaxa”工具，然后运行"ALL unpredicted/validated…”选项，来创建样品文件夹中的TSV表格和PID文件</li>
					<li>将"_work”文件夹上传到服务器中</li>
					<li>当导入时，点击"Skip <code>tsv</code> files"选项</li>
				</ul>
			</div>
		
		</div>
	</div>
</div>

<form class="form" method="post" enctype="multipart/form-data">

	<div class="row" style="margin: 5px">
		<div class="col-sm-5">
  <div class="form-group">
				<label class="control-label">在服务器上选择文件夹或zip文件</label>
      <div class="input-group">
					<input type="text" class="form-control" id="ServerPath" name="ServerPath" value="" size="200">
            <span class="input-group-btn">
                <button class="btn btn-default" type="button"  data-toggle="modal" data-target="#FileModal">
					<span class="glyphicon glyphicon-folder-open" aria-hidden="true"></span></button>
                </span>
				</div>
				<p class="help-block">联系项目管理员，了解在哪里以及如何上传数据。一旦导入完成，所有的数据文件夹/文件都可以在服务器上安全地删除。
				<br>项目管理员 : {{ g.prjmanagermailto |safe }}</p>
			</div>
		</div>

		<div class="col-sm-2" style="text-align: center">
			<label class="control-label">或者</label>
		</div>

		<div class="col-sm-5">
<div class="form-group">
				<label class="control-label">上传压缩为zip文件的文件夹</label>
				<input class="form-control" type="file" id="uploadfile" name="uploadfile" size="200">
				<p class="help-block">仅用于 &lt;&nbsp;100MB的 zip文件。</p>
			</div>
		</div>
	</div>

	<div class="row">
		<div class="col-sm-8 col-sm-offset-2">

  <div class="form-group">
				<div class="checkbox">
					<label>
						<input type="checkbox" id="skiploaded" name="skiploaded" value="Y">跳过已经导入的tsv文件
					</label>
    </div>
  </div>
  <div class="form-group">
				<div class="checkbox">
					<label>
						<input type="checkbox" id="skipobjectduplicate" name="skipobjectduplicate" value="Y">跳过已经导入的对象
					</label>
    </div>
  </div>

			<p><a href="#advanced" data-toggle="collapse" class="help">高级选项</a></p>
			<div id="advanced" class="collapse">
				<div class="form-group">
					<label for="port" class="control-label">可选的分类法映射</label>
					<p class="help-block">这允许更改先前分类的对象的类别名称，以匹配应用程序中包含的UniEuk分类框架中的名称。<br>例:<br>
					crust_cop = Copepoda<br>
					gelatinous medusae = Cnidaria (Hydrozoa) <span style="margin-left: 20px;"></span></p>

          <table><tr><td>导入的名称 : <input type="text" id="oldname" class="form-control" style="width: 100px;display: inline-block;">
            UniEuk名称 :&nbsp; </td><td ><div class="input-group" >
            <select id="taxolb" name="taxolb" style="width: 210px" class='taxolb' > </select>
            <span class="input-group-btn">
                <button class="btn btn-default btn-sm" type="button"  data-toggle="modal" data-target="#TaxoModal" data-mytargetid="taxolb">
                    <span id=OpenTaxoLB class="glyphicon glyphicon-th-list" aria-hidden="true"></span></button>
                </span>
          </div><!-- /input-group -->
          </td><td>
            <button class="btn btn-primary " type="button" onclick="TaxoHelperBtAdd();">加入列表</button>
          </td>
          </tr></table>

					<textarea class="form-control" id="TxtTaxoMap" name="TxtTaxoMap" rows="4" placeholder="oldname = UniEuk name"></textarea>
				</div>
			</div>

    <input type="hidden" name="starttask" value="Y">
			<button type="submit" class="btn btn-lg btn-block btn-primary">开始导入图片及tsv文件</button>
    </div>
  </div>

</form>
  </div>
</div>

  <div class="panel panel-default" style="margin: 20px 5px">
  <div class="panel-heading">
    <h3 class="panel-title">只导入图片 </h3>
  </div>
  <div class="panel-body">
    如果你只有图片而没有数据文件，可以使用这里的简单导入
<div class="col-sm-8 col-sm-offset-2">
<a href="/prj/simpleimport/{{ g.prjprojid }}" class="btn btn-lg btn-block btn-primary">开始只导入图片</a>
  </div>
    </div></div>


  <div class="panel panel-default" style="margin: 20px 5px">
  <div class="panel-heading">
    <h3 class="panel-title">重新导入及更新元数据信息</h3>
  </div>
  <div class="panel-body">
    如果你已经上传了你的图像，并且你想要更新你的元数据信息。
    <div class="col-sm-8 col-sm-offset-2">
<a href="/Task/Create/TaskImportUpdate?p={{ g.prjprojid }}" class="btn btn-lg btn-block btn-primary">开始重新导入TSV文件以更新元数据信息</a>
      </div>
    </div></div>


  <div class="panel panel-default" style="margin: 20px 5px">
  <div class="panel-heading">
    <h3 class="panel-title">从另一个数据库导入</h3>
  </div>
  <div class="panel-body">
    从另一个Ecotaxa实例导入到一个空项目中。
    <div class="col-sm-8 col-sm-offset-2">
<a href="/Task/Create/TaskImportDB?p={{ g.prjprojid }}" class="btn btn-lg btn-block btn-primary">开始从其他实例导入</a>
      </div>
    </div></div>


<script>
function TaxoHelperBtAdd(){
  var s=$('#oldname').val()+"="+$('#taxolb option:selected').text();
  var txt=$('#TxtTaxoMap');
  txt.val( txt.val() +s+ "\n");
}

$(document).ready(function() {
    $('#FileModal').on('show.bs.modal', function () {
        $("#TaxoModalBody").html(""); {# Pour eviter les conflit sur le jstree suite à des ouverture successive car le jstree est dans la modal cachée #}
         $("#FileModalBody").html("Loading...").load("/common/ServerFolderSelect");
    });
    $(".taxolb").select2({
        ajax: {
            url: "/search/taxo",
            dataType: 'json',
            delay: 250,
            data: function (params) {  return { q: params.term, page: params.page };  },
            processResults: function (data) { return { results: data};  },
            cache: true
        },
        minimumInputLength: 3
    }); // Select2 Ajax
    $('#TaxoModal').on('show.bs.modal', function () {
         $("#FileModalBody").html("");
         $("#TaxoModalBody").html("Loading...").load("/search/taxotree?target=taxolb");
    });
  }); // Ready
</script>

<!-- Modal -->
<div class="modal " id="FileModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="ModalLabel">选择一个文件夹或一个zip文件</h4>
      </div>
      <div class="modal-body">
        <div id="FileModalBody">...</div>
      </div>
    </div>
  </div>
</div>


<!-- Modal -->
<div class="modal " id="TaxoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="ModalLabel">分类树</h4>
      </div>
      <div class="modal-body">
        <div id="TaxoModalBody">...</div>
      </div>
    </div>
  </div>
</div>



    <!-- <div id="ImportantNote" class="panel panel-danger" style="float: right;position: absolute; top:80px;right: 20px;width: 600px;">
  <div class="panel-heading">
    <h3 class="panel-title">IMPORTANT NOTE
    <button type="button" class="close" aria-label="Close" onclick="$('#ImportantNote').hide();"><span aria-hidden="true">&times;</span></button>
    </h3>
  </div>
  <div class="panel-body">
    EcoTaxa的维护和完善不是免费的。如果您能在下次拨款中拨出一些资金来支持它，我们将不胜感激。
    <br><a href="mailto:picheral@obs-vlfr.fr" title="Press CTRL to open it on another tab (usefull if you use GMail)">联系我们</a> ，评估什么数据是合理且有用的。
    </div></div> -->



{% endblock %}